<template>
  <div>
    <el-table :data="nowDateTableData" style="width: 100%" max-height="600" :row-class-name="tableRowClassName"
              v-loading="loading">
      <el-table-column prop="tradeDate" label="委托时间" width="180" align="center"/>
      <el-table-column prop="currency" label="委托币种" width="180" align="center"/>
      <el-table-column label="挂单类型" align="center">
        <template slot-scope="{row}">
          {{ row.type | entrust_type_to_Ch }}
        </template>
      </el-table-column>
      <el-table-column prop="price" label="价格" align="center"/>
      <el-table-column prop="totalAmount" label="挂单总数量" align="center"/>
      <el-table-column prop="tradeAmount" label="已成交数量" align="center"/>
      <el-table-column prop="status" label="挂单状态" align="center">
        <template slot-scope="{row}">
          {{ row.status | entrust_status_to_Ch }}
        </template>
      </el-table-column>
      <el-table-column prop="fees" label="交易手续费" align="center"/>
    </el-table>
  </div>
</template>

<script>
  import {getNowOrders} from '@/api/modules/platformAccount'
  import {entrust_type_to_Ch, entrust_status_to_Ch} from '@/utils/codeTransition';

  export default {
    name: "NowDelegate",
    props: {
      currency: {
        type: String,
        default: 'BTC-USDT'
      }
    },
    filters: {
      entrust_type_to_Ch,
      entrust_status_to_Ch
    },
    data() {
      return {
        nowDateTableData: [],
        bourseTag: "",
        loading: true
      }
    },
    created() {
      console.log("当日委托刷新了")
      this.getNowDateOrder()
    },
    methods: {
      getNowDateOrder() {
        getNowOrders({currency: this.currency}).then(res => {
          if (res.code === 20000) {
            console.log("展示数据")
            console.log("getOrders", res)
            this.nowDateTableData = res.data
          } else {
            console.log("不展示数据")
          }
        })
      },
      tableRowClassName({row, rowIndex}) {
        debugger
        if (row.currency + '-USDT' == this.currency) {
          return 'warning-row';
        }
        return '';
      }
    }
  }
</script>

<style scoped>
  .el-table .warning-row {
    background: oldlace;
  }

  .el-table .success-row {
    background: #f0f9eb;
  }
</style>
